<template>
	<view class="login">
		<image class="bg-image" src="/loginPages/static/images/login-bg.jpg" mode="aspectFill"></image>
		<view class="bg-cover"></view>
		<view class="login-button">
			<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">手机号码一键登录</button>
		</view>
	</view>
</template>

<script>
	import WXBizDataCrypt from "@/common/WXBizDataCrypt.js";
	export default {
		data() {
			return {
				userInfo: {
					openid: "",
					session_key: "",
				},
			};
		},
		created() {

			uni.login({
				provider: 'weixin',
				success: (res) => {
					console.log(res, 'res')
					if (res.code) { //微信登录成功 已拿到code  
						this.jsCode = res.code //保存获取到的code 
						console.log(this.jsCode, "jsCode")
						uni.request({
							url: 'https://api.weixin.qq.com/sns/jscode2session',
							method: 'GET',
							data: {
								appid: 'wxce4c9d5ec41da681', //你的小程序的APPID  
								secret: 'd3ab3b94995d5764684e1314d88670fb', //你的小程序的secret,  
								js_code: res.code, //wx.login 登录成功后的code  
								grant_type: 'authorization_code',
							},
							success: (cts) => {
								console.log(cts, 'login');
								// 换取成功后 暂存这些数据 留作后续操作  
								this.openid = cts.data.openid //openid 用户唯一标识  
								// this.unionid = cts.data.unionid //unionid 开放平台唯一标识  
								this.session_key = cts.data.session_key //session_key  会话密钥  
							}
						});
					} else {
						console.log('登录失败！' + res.errMsg)
					}
				}
			})
		},

		methods: {
			onChooseAvatar(e) {
				console.log(e)
				// this.avatarUrl = e.detail.avatarUrl

			},
			getPhoneNumber(e) {
				console.log(e, 'eeeeeee');
				if (e.detail.errMsg == 'getPhoneNumber:ok') {
					//允许授权
					console.log(this.session_key, " this.session_key")
					let pc = new WXBizDataCrypt('wxce4c9d5ec41da681', this.session_key);
					console.log(pc, "pc")
					// //wxXXXXXXX为你的小程序APPID
					let data = pc.decryptData(e.detail.encryptedData, e.detail.iv);

					console.log(data); //data就是最终解密的用户信息
					let {
						countryCode,
						purePhoneNumber,
						phoneNumber,
						watermark
					} = data
					// //后续操作。。。
					uni.setStorageSync('userInfo', {
						countryCode,
						purePhoneNumber,
						phoneNumber,
						watermark
					})
					uni.switchTab({
						url: "/pages/aircraftParameters/aircraftParameters"
					})
				} else {
					//用户决绝授权或授权失败
					console.log(e.detail.errMsg)
					//拒绝授权后弹出一些提示
					uni.showToast({
						title: '拒绝授权',
						icon: 'error',
						duration: 2000
					});
				}
			},

			test() {
				uni.getUserProfile({
					desc: '获取你的昵称、头像、地区及性别',
					success: async (res) => {
						this.userInfo = res.userInfo
						await uni.setStorageSync("userInfo", this.userInfo)
						await uni.switchTab({
							url: "/pages/aircraftParameters/aircraftParameters"
						})
					},
					fail: res => {
						console.log(2);
						console.log(res)
						//拒绝授权
						uni.showToast({
							title: '您拒绝了请求,不能正常使用小程序',
							icon: 'error',
							duration: 2000
						});
						return;
					}
				});
			}
			// getUserInfo() {
			// 	return new Promise((resolve, reject) => {
			// 		uni.getUserProfile({
			// 			lang: 'zh_CN',
			// 			desc: '用户登录',
			// 			success: (res) => {
			// 				resolve(res.userInfo)
			// 			},
			// 			fail: (err) => {
			// 				reject(err)
			// 			}
			// 		})
			// 	})
			// },

			// getLogin() {
			// 	return new Promise((resolve, reject) => {
			// 		uni.login({
			// 			success(res) {
			// 				resolve(res.code)
			// 			},
			// 			fail: (err) => {
			// 				reject(err)
			// 			}
			// 		})
			// 	})
			// },

			// login() {
			// 	let userInfo = this.getUserInfo();
			// 	let uniCode = this.getLogin();


			// 	Promise.all([userInfo, uniCode]).then((res) => {
			// 		//都获取权限成功
			// 	}).catch(err => {

			// 	})
			// }

		}
	}
</script>

<style lang="scss">
	.login {
		height: 100vh;
		width: 100vw;
		position: relative;

		.bg-image,
		.bg-cover {
			position: fixed;
			height: 100vh;
			width: 100vw;
			top: 0;
			left: 0;
			z-index: -1;
			vertical-align: middle;
		}

		.login-button {
			position: absolute;
			width: 100%;
			padding: 0 40rpx;
			box-sizing: border-box;
			bottom: 140rpx;
			letter-spacing: 10rpx;

			>button {
				background-color: $color-green;
				color: white;
			}
		}
	}


	// .bg-cover {
	// 	background-color: rgba(255, 255, 255, 0.2);
	// 	backdrop-filter: blur(5px);
	// }
</style>